import _ from "lodash";
import React from "react";
import { List } from "weaver-mobile";
import { withRouter } from 'react-router-dom';
import { When } from "../../../common/if";

const { Item } = List;
const { Brief } = Item;

@withRouter
export default class AppList extends React.Component {
  static defaultProps = {
    list: []
  };

  constructor() {
    super();

    this.onItemClick = _.memoize(this.onItemClick.bind(this));
  }

  onItemClick(id) {
    const { history } = this.props;
    const pathname = `/app/analysis/${id}`;

    return () => history.push({ pathname });
  }

  render() {
    const { list } = this.props;

    return (
      <When condition={!!list.length}>
        <List>
          {list.map(app => (
            <Item
              key={app.uuid}
              arrow='horizontal'
              onClick={this.onItemClick(app.id)}
            >
              {app.name}
              <Brief>
                {app.createDate} {app.createTime}
                <span style={{ float: 'right', marginRight: 10 }}>{app.creatorName}</span>
              </Brief>
            </Item>
          ))}
        </List>
      </When>
    );
  }
}